body {
  padding: 50px 30px;
  font-family: "Microsoft Yahei","冬青黑体简体中文 w3";
  /*height: 1000px;*/
}
a {
  color: #00b7ff; text-decoration: none;
}

.none{
	display: none;
}
.imitate-href{
	color: #00b7ff;
}
.imitate-href:hover{
	cursor: pointer;	
}
.main-content h2{
	margin-bottom: 30px; height: 56px; background-image: url(/images/title.png); background-repeat: no-repeat; text-indent: -9999px;
}
.main-content h2.serial-title{background-position: 0 -70px;}
.main-content h2.reviewer-title{background-position: 0 -139px;}
.main-content h2.perInfo-title{background-position: 0 -214px;}
.main-content h2.userInfor-title{background-position: 0 -294px;}
.btn{
	font-family: "Microsoft Yahei","冬青黑体简体中文 w3";
	background: #1b9dec;
	border: none;
	color: #fff;
	padding: 8px 10px;
	border-radius: 4px;
	cursor: pointer;
	background-image: -moz-linear-gradient(top, #1da7ee, #178ee9);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#1da7ee), to(#178ee9));
	background-image: -webkit-linear-gradient(top, #1da7ee, #178ee9);
	background-image: -o-linear-gradient(top, #1da7ee, #178ee9);
	background-image: linear-gradient(to bottom, #1da7ee, #178ee9);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff1da7ee', endColorstr='#ff178ee9', GradientType=0);
	-webkit-box-shadow: 0 1px 0 rgba(0,0,0,0.2),inset 0 1px rgba(255,255,255,0.03);
	box-shadow: 0 1px 0 rgba(0,0,0,0.2),inset 0 1px rgba(255,255,255,0.03);
}
.btn:hover{
	background-color: #0085d4;
	background-image: -moz-linear-gradient(top, #008fd8, #0075cf);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#008fd8), to(#0075cf));
	background-image: -webkit-linear-gradient(top, #008fd8, #0075cf);
	background-image: -o-linear-gradient(top, #008fd8, #0075cf);
	background-image: linear-gradient(to bottom, #008fd8, #0075cf);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff008fd8', endColorstr='#ff0075cf', GradientType=0);
}

.overdot{
	white-space:nowrap;
	text-overflow:ellipsis;
	-o-text-overflow:ellipsis;
	overflow:hidden;
}

.disable{color: #999;}

/*baidu share style*/
.bdsharebuttonbox{position: fixed; top: 0; right: 0;}

/*头像尺寸*/
.avatar{width: 76px; height: 76px; border: 0; vertical-align: top;}
.avatar-120{width: 128px; height: 128px; border-radius: 50%; margin-bottom: 10px;border: 2px solid #95a153;padding: 5px;}

/*left content*/
.left-content{width: 250px; position: fixed; top: 0; bottom: 0; left: 0; background: #534F49;}
.username{color: #fff;}

/*perinfo*/
.perinfo{height: 200px;}
.perinfo-nav li{background: #534F49; border-radius: 20px;height: 35px; width: 130px; margin-bottom: 20px; text-align: center; line-height: 35px; display: inline-block; margin-right: 10px;color: #fff; cursor: pointer;}
.perinfo-nav li.sel{background: #95a153;}

/*nav*/
.nav{width: 180px; margin-right: auto; margin-left: auto;}
.nav li{width: 178px; text-align: center; border-radius: 17px; margin-bottom: 20px; height: 30px; background: #5c5852;border-bottom: 1px solid #423f3a;background: rgba(255,255,255,0.1);border-bottom: 1px solid rgba(0,0,0,0.4);line-height: 30px;white-space: nowrap;}
.nav li:hover{background: #95A153;}
.nav li a.router-link-active{background: #95A153; border-radius: 17px;}
.nav li a{display: block; color: #fff;}

/*main content*/
.main-content{margin-left: 250px;}

/* mybook */
.mybook .content  ul li a{display: inline-block; margin-right: 15px; vertical-align: top;}
.mybook .content .book-title{width: 200px; }
/*book List*/
.serial{font-size: 14px; margin-right: -50px;}
.serial li{display: inline-block; *display: inline; *zoom: 1; width: 164px; margin-right: 40px; vertical-align: top; margin-bottom: 30px; font-size: 12px; min-height: 290px;}
.serial li .title{font-size: 16px; padding: 10px;}
.serial li .title a:hover{color: #fff; background: #0590C7;}
.serial li .intro{color: #666; padding-left: 10px; padding-right: 10px; padding-bottom: 10px;}
.serial li .time{color: #999; padding-left: 10px; padding-right: 10px; padding-bottom: 10px;}

.page-content{min-height: 500px;}
.page-control{margin-top: 30px;}
.page-control li{display: inline-block;width: 20px;cursor: pointer; height: 20px; border-radius: 50%; border:1px solid #ccc;background:rgb(236, 227, 209); text-align: center; margin-right: 10px;}
.page-control li.sel{background: rgb(240, 184, 71);}


/*reviewer list*/
.reviewer li{position: relative; width: 250px; display: inline-block; *display: inline; *zoom: 1; vertical-align: top; margin-right: 10px; padding: 10px; margin-bottom: 30px;}
.reviewer li a.avatar{position: absolute;}
.reviewer li a img{width: 96px; height: 96px; vertical-align: top;}
.reviewer li .userInfo{margin-left: 110px;}
.reviewer li .userInfo a.name{display: block; font-size: 16px; font-weight: bold;font-size: 14px; margin-bottom: 15px;}
.reviewer li .userInfo p{font-size: 12px; margin-bottom: 5px;}
.reviewer li .commentContent{position: relative;}
.reviewer li .more{width: 33px; position: absolute;right: 0; top: 40px;}

/*paperbook list*/
.paperBook{margin-right: -25px;}
.paperBook li{display: inline-block; *display: inline; *zoom: 1; position: relative; margin-right: 25px; margin-bottom: 40px; vertical-align: top;}
.paperBook li .delete{position: absolute; right: 0; top: 0; cursor: pointer;}
.paperBook li .paperCoverImg{float: left;}
.paperBook li .info{margin-left: 155px; width: 160px; font-size: 14px;}
.paperBook li .info h3{margin-bottom: 15px;}
.paperBook li .info div{margin-bottom: 5px; font-size: 12px;}
.tags{text-indent: 25px; background: url(/images/tag.png) no-repeat 0px 9px; margin-top: 20px; margin-bottom: 20px;}
.tags span{display: inline-block; background: #B4BE7C; color: #fff; padding: 4px; text-indent: 0; margin-bottom: 20px;}

/*paperbook content*/
.main-content h1.title{margin-bottom: 30px; color: #4bf; font-weight: bold; font-size: 20px;}
.paperBookCont{display: inline-block; font-size: 14px;}
.paperBookContIntro .title{margin-top: 20px; color: #95a153;}
.paperBookContIntro p{font-size: 14px;}
.paperBookCont .cover{float: left;}
.paperBookCont .paperBookIntro{margin-left: 170px;}
.tags span{margin-right: 20px;}

/*表单样式
*登录 注册 后台上传 表单宽度一致
*/
.form{width: 240px;}
.login,.reg{margin-top: 20px; float: right;}

/**
*写书评的全屏
*/
.fullBg{position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,.5);}

.comment{width: 460px; height: 310px; border-radius: 10px; border:5px solid #e0e0e0; position: absolute; margin-left: -250px; margin-top: -175px; left: 50%; top: 50%; background: #fff; padding: 20px;}
.comment .close{position: absolute; right: 5px; top: -6px; font-size: 32px; cursor: pointer; color: #888;}
.comment .close:hover{color: #555;}
.comment h3{margin-bottom: 30px;}
.comment label{display: block; margin-bottom: 30px;}
.comment .btn{float: right;}

/**
*查看书评的动画全屏
*/
.moreBox{width: 460px; height: 350px; border-radius: 10px; border:5px solid #e0e0e0; position: absolute; margin-left: -250px; margin-top: -195px; left: 50%; top: 50%; background: #fff; padding: 20px; overflow-y: auto;}
.moreBox .close{position: absolute; right: 5px; top: -6px; font-size: 32px; cursor: pointer; color: #888;}
.moreBox .close:hover{color: #555;}

/***
*窗口弹出动画
*书评人查看更多的nore更多动画
*/
.showdialog{
-webkit-animation:pulse .5s 0s ease both;
-moz-animation:pulse .5s 0s ease both;}
@-webkit-keyframes pulse{
0%{-webkit-transform:scale(0)}
100%{-webkit-transform:scale(1)}
}
@-moz-keyframes pulse{
0%{-moz-transform:scale(0)}
100%{-moz-transform:scale(1)}
}
.showmore{
-webkit-animation:tada 1s .2s ease both;
-moz-animation:tada 1s .2s ease both;}
@-webkit-keyframes tada{
0%{-webkit-transform:scale(1)}
10%,20%{-webkit-transform:scale(0.9) rotate(-3deg)}
30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg)}
40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg)}
100%{-webkit-transform:scale(1) rotate(0)}
}
@-moz-keyframes tada{
0%{-moz-transform:scale(1)}
10%,20%{-moz-transform:scale(0.9) rotate(-3deg)}
30%,50%,70%,90%{-moz-transform:scale(1.1) rotate(3deg)}
40%,60%,80%{-moz-transform:scale(1.1) rotate(-3deg)}
100%{-moz-transform:scale(1) rotate(0)}
}
.top-animate{
animation:bounceInDown .4s 0s ease both;
-webkit-animation:bounceInDown .4s 0s ease both;
-moz-animation:bounceInDown .4s 0s ease both;}
@-webkit-keyframes bounceInDown{
0%{opacity:0;
-webkit-transform:translateY(-2000px)}
60%{opacity:1;
-webkit-transform:translateY(30px)}
80%{-webkit-transform:translateY(-10px)}
100%{-webkit-transform:translateY(0)}
}
@-moz-keyframes bounceInDown{
0%{opacity:0;
-moz-transform:translateY(-2000px)}
60%{opacity:1;
-moz-transform:translateY(30px)}
80%{-moz-transform:translateY(-10px)}
100%{-moz-transform:translateY(0)}
}
@keyframes bounceInDown{
0%{opacity:0;
-moz-transform:translateY(-2000px)}
60%{opacity:1;
-moz-transform:translateY(30px)}
80%{-moz-transform:translateY(-10px)}
100%{-moz-transform:translateY(0)}
}

/*手机样式适配*/
@media screen and (max-width: 768px){
	body{padding: 10px;}
	.phone-btn{width: 45px; height: 45px; position: fixed; right: 20px; bottom: 20px; background: url(/images/round-btn.png) no-repeat; z-index: 6; border-radius: 50%;}
	.left-content{width: 100%; z-index: 5; display: none;}
	.paperBook{margin-right: 0;}
	.paperBook li{margin-right: 0; width: 100%; background: #ececec; border-bottom: 2px solid #e0e0e0; margin-bottom: 25px; border-radius: 4px;}
	.paperBook li .paperCoverImg{margin: 10px 0 10px 10px;}
	.paperBook li .info{margin-top: 10px; margin-left: 165px;}
	.paperBook li .info .title{font-size: 18px;}

	.serial{margin-right: -10px;}
	.serial li{margin-right: 10px;}

	.reviewer li{width: 93%; margin-right: 0px;}

	.main-content{margin-left: 0; width: 340px; margin: 20px auto;}

	.mybook .content  ul li a{display: inline-block; margin-right: 5px; vertical-align: top;}
	.mybook .content .book-title{max-width: 90px; }

	.moreBox,.comment{width: 80%; margin-left: -170px;}

	/*share*/
	.pc{display: none;}
	.phone-style{width: 100%; background: rgba(0,0,0,.5);}
	.phone-style .bds_qzone{background-image: url(/images/share-btn1.png);background-repeat: no-repeat;background-position: 0 0!important; background-size: contain; width: 154px; height: 47px;}
	.phone-style .bds_tsina{background-image: url(/images/share-btn.png);background-repeat: no-repeat;background-position: 0px 0!important; background-size: contain; width: 154px; height: 47px; float: right;}
}
